<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <!-- dskjfklfsaldkfjkasldjf -->
        <li>111</li>
        <li>222</li>
        <li>333</li>
    </ul>
    <div></div>
    <script>

        var oUl = document.querySelector('ul');
        // childNodes获取节点的子节点[所有的子节点，不仅仅是元素节点]
        var child1 = oUl.childNodes;
        console.log('childNodes: ',child1);

        /**
         * 作用：找到当前元素的所有元素子节点
         * return []
         */
        function childElements(ele){
            var eleArr = [];
            var children = ele.childNodes;
            // 遍历所有的子节点
            for(var i = 0; i < children.length; i++){
                if(children[i].nodeType === 1){// 如果nodeType是1的，说明是元素子节点
                    eleArr.push(children[i]);// 放入新数组
                }
            }
            return eleArr; // 元素子节点新数组返回
        }

        var oLis = childElements(oUl);
        console.log(oLis);


        //children: 获取当前元素的元素子节点

        var oUl = document.querySelector('ul');
        console.log('children: ',oUl.children); 


       
    </script>
</body>
</html>